<template>
  <div class="demo-tabs">
    <basic />
    <roll />
    <styles />
    <viscosity />
    <animated />
    <swipeable />
    <scrollspy />
    <asyncChange />
  </div>
</template>
<script lang="ts">
import { defineComponent } from "vue";
import basic from "./basic.vue";
import roll from "./roll.vue";
import styles from "./styles.vue";
import viscosity from "./viscosity.vue";
import animated from "./animated.vue";
import swipeable from "./swipeable.vue";
import scrollspy from "./scrollspy.vue";
import asyncChange from "./asyncChange.vue";

export default defineComponent({
  components: {
    basic,
    roll,
    styles,
    viscosity,
    animated,
    swipeable,
    scrollspy,
    asyncChange,
  },
});
</script>
<style lang="less" scoped>
.demo-tabs {
  :deep(.vcu-tab__pane) {
    height: 100px;
    background: #fff;
  }
}
</style>
